/**
 * Created by zhouli on 18/1/30
 * Email li.zhou@huilianyi.com
 * 组织架构显示人员信息
 */
import React from 'react';
import 'styles/enterprise-manage/org-structure/org-component/org-person-info.scss';
import {Button, Icon} from 'antd';
import menuRoute from 'routes/menuRoute';
import {messages} from "share/common";

class OrgStructurePersonInfo extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      loading: true,
      user: {}
    }
  }

  componentWillMount() {
    this.setState({user: this.props.user});
  }

  componentWillReceiveProps(nextProps) {
    this.setState({user: nextProps.user});
  }

  //去用户详情界面
  goToPersonDetail = () => {
    let { user } = this.state;
    let path = menuRoute.getRouteItem('person-detail', 'key').url.replace(":userOID", user.userOID);
    this.context.router.push(path);
  }

  //渲染激活状态
  renderActivated = (activated) => {
    return activated ? (<span>{messages('enterprise-manage.key121'/*已激活*/)}</span>) : (<span>{messages('enterprise-manage.key122'/*未激活*/)}</span>)
  }
  //渲染性别
  renderSex = (gender) => {
    // *0男1女，2未知
    if (parseInt(gender) === 0) {
      return (<div className="content">{messages('enterprise-manage.key123'/*男*/)}</div>)
    } else if (parseInt(gender) === 1) {
      return (<div className="content">{messages('enterprise-manage.key124'/*女*/)}</div>)
    } else {
      return (<div className="content">{messages('enterprise-manage.key125'/*未知*/)}</div>)
    }
  }
  renderTime = (date) => {
    if (date) {
      return (<span>{(new Date(date)).format("yyyy-MM-dd")}</span>)
    } else {
      return (<span>{messages('enterprise-manage.key125'/*未知*/)}</span>)
    }
  }

  renderStatus = (status) => {
    //在职，离职，待离职
    if (status + "" === "1001") {
      return (<span>
        {messages('enterprise-manage.key126'/*在职*/)}
      </span>);
    } else if (status + "" === "1002") {
      return (<span>
        {messages('enterprise-manage.key127'/*待离职*/)}
      </span>);
    } else if (status + "" === "1003") {
      return (<span>
        {messages('enterprise-manage.key128'/*离职*/)}
      </span>);
    } else {
      return ( <span>
        {messages('enterprise-manage.key125'/*未知*/)}
      </span>)
    }
  }

  render() {
    let {user} = this.state;
    return (
      <div className="org-structure-person-info">
        <div className="person-info-avater-wrap">
          <div className="f-left avater-icon">
            <Icon type="frown"/>
          </div>
          <div className="f-left person-info">
            <div className="f-left name">{user.fullName}</div>
            <div className="f-left status">
              {this.renderActivated(user.activated)}
            </div>
          </div>
          <div className="f-right avater-right">
            <Button type="primary" onClick={this.goToPersonDetail}>
              {messages('enterprise-manage.key129'/*查看详情*/)}
            </Button>
          </div>
        </div>

        <div className="person-info-row">
          <div className="title">
            {messages('enterprise-manage.key130'/*公司*/)}
          </div>
          <div className="content">{user.companyName}</div>
          <div className="clear"/>
        </div>
        <div className="person-info-row">
          <div className="title">
            {messages('enterprise-manage.key131'/*直属领导*/)}
          </div>
          <div className="content">{user.directManagerName}</div>
          <div className="clear"/>
        </div>
        <div className="person-info-row">
          <div className="title">
            {messages('enterprise-manage.key132'/*部门*/)}
          </div>
          <div className="content">{user.departmentName}</div>
          <div className="clear"/>
        </div>
        <div className="person-info-row">
          <div className="title">
            {messages('enterprise-manage.key133'/*邮箱*/)}
          </div>
          <div className="content">{user.email}</div>
          <div className="clear"/>
        </div>
        <div className="person-info-row">
          <div className="title">
            {messages('enterprise-manage.key134'/*电话*/)}
          </div>
          <div className="content">{user.mobile ? user.mobile : ""}</div>
          <div className="clear"/>
        </div>

        <div className="person-info-row">
          <div className="title">
            {messages('enterprise-manage.key135'/*职务*/)}
          </div>
          <div className="content">{user.duty}</div>
          <div className="clear"/>
        </div>
        <div className="person-info-row">
          <div className="title">
            {messages('enterprise-manage.key136'/*职位*/)}
          </div>
          <div className="content">{user.title}</div>
          <div className="clear"/>
        </div>
        <div className="person-info-row">
          <div className="title">
            {messages('enterprise-manage.key137'/*级别*/)}
          </div>
          <div className="content">{user.rank}</div>
          <div className="clear"/>
        </div>
        <div className="person-info-row">
          <div className="title">
            {messages('enterprise-manage.key138'/*入职时间*/)}
          </div>
          <div className="content">{this.renderTime(user.entryDate)}</div>
          <div className="clear"/>
        </div>
        <div className="person-info-row">
          <div className="title">
            {messages('enterprise-manage.key139'/*状态*/)}
          </div>
          <div className="content">
            {this.renderStatus(user.status)}
          </div>
          <div className="clear"/>
        </div>
        <div className="person-info-row">
          <div className="title">
            {messages('enterprise-manage.key140'/*生日*/)}
          </div>
          <div className="content">{this.renderTime(user.birthday)}</div>
          <div className="clear"/>
        </div>

        <div className="person-info-row">
          <div className="title">
            {messages('enterprise-manage.key141'/*性别*/)}
          </div>
          { this.renderSex(user.gender) }
          <div className="clear"/>
        </div>
      </div>
    )
  }

}

OrgStructurePersonInfo.propTypes = {
  user: React.PropTypes.object.isRequired
};
OrgStructurePersonInfo.contextTypes = {
  router: React.PropTypes.object
}
export default OrgStructurePersonInfo;
